<!doctype html>
<html>

	<head>
		<meta charset="UTF-8">
		<meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
		<title></title>
		<link href="../../plugins/mui/mui.min.css" rel="stylesheet" />
		<link rel="stylesheet" href="../../css/chineseHospital/doctor.css" />
		<script src="../../js/statistics.js"></script>
		<style>
			.header a{
				color:#fff;
			}
		</style>
	</head>

	<body>
		<header class="mui-bar mui-bar-nav header">
			<a class="mui-action-back mui-icon mui-icon-left-nav mui-pull-left"></a>
			<h1 class="mui-title">排班列表</h1>
		</header>
		<div class="body">
			<div class="title">
				<p></p>
			</div>
			<div class="list">

			</div>
		</div>
		<script src='../../plugins/jquery/jquery-3.1.0.min.js'></script>
		<script src="../../plugins/mui/mui.min.js"></script>
		<script src="../../js/getApiToken.js"></script>
		<script src='../../plugins/template/template.js'></script>
		<script type="text/javascript" src="../../js/md5.js" ></script>
		<script src='../../plugins/fontset/fontset.js'></script>
		<script type="text/html" id="title">
				<div data-id="{{data.iysbm}}">
					<div class="up">
						<span>{{data.name}}</span>
						<span>{{data.position}}</span>
						<span id="right-angle"></span>
					</div>
					<div class="down">
						专长：{{data.good}}
					</div>
				</div>
		</script>
		<script type="text/html" id="list">
			<ul>
				{{each data as value index}}
				<li>
					<div class="time">
						<p>{{value.date}}&nbsp;{{value.time}}</p>
						<p>{{value.cksmc}}</p>
						<span>余号: 
							{{if value.number > 9}}
							<i class="lot">{{value.number}}</i>
							{{else if value.number == 0}}
							<i>{{value.number}}</i>
							{{else}}
							<i class="less">{{value.number}}</i>
							{{/if}}
						</span>
					</div>
					<div class="button" data-id="{{value.iysbm}}" data-bh="{{value.cpbbh}}">
						{{if value.number > 0}}
						<button>预约</button>
						{{else}}
						<button class="none">预约</button>
						{{/if}}
					</div>
				</li>
				{{/each}}
			</ul>
		</script>
		<script type="text/javascript">
			mui.init();
			
			mui.plusReady(function(){
				var ysbm = plus.webview.currentWebview().ysbm,
					ksmc = plus.webview.currentWebview().ksmc;
				$(".title>p").text(ksmc);
				myAjax('home/Hospital_service/getDoctors','get',{'iysbm':ysbm},function(data){
					if(data.code == 1){
						initData(data.data.info);
						initList(data.data.list);
						if(data.data.info.position == '' || !data.data.info.position){
							$(".up").children("span").eq(1).hide();
							console.log(111)
						}
					}
				})
				mui(".title").on('tap','#right-angle',function(){
					var ysbm = $(".title>div").attr('data-id');
					mui.openWindow({
						url:'doctor_detail.html',
						id:'doctor_detail.html',
						extras:{
							'ysbm':ysbm
						}
					})
				})
				mui(".list").on('tap','.button',function(){
					var ysbm = $(this).attr('data-id'),
						pbbh = $(this).attr('data-bh');
					mui.openWindow({
						url:'registration.html',
						id:'registration.html',
						extras:{
							'ysbm':ysbm,
							'pbbh':pbbh
						}
					})
				})
			});
			function initData(data){
				var body = {
					data:data
				};
				var html = template('title',body);
				$(".title").append(html);
			}
			function initList(data){
				var list = {
					data:data
				};
				var html = template('list',list);
				$(".list").html(html);
			}
		</script>
	</body>
</html>